{%- comment -%} 用于调试（需要把ts里面的引入包注释） {%- endcomment -%}
{% comment %} <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>

<script src="https:////cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/ScrollMagic.min.js"></script>
<script src="https:////cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/plugins/animation.gsap.js"></script>
<script src="https:////cdnjs.cloudflare.com/ajax/libs/ScrollMagic/2.0.7/plugins/debug.addIndicators.min.js"></script> {% endcomment %}
{%- assign section_identifier = '#shopify-section-' | append: section.id -%}
{%- style -%}
  {{ section_identifier }} .sec_heading {
    font-size: 70.4px;
    line-height: 77.44px;
    letter-spacing: -1.41px;
  }
  @media screen and (max-width: 820px) {
    {{ section_identifier }} .sec_heading {
      font-size: 40px;
      line-height: 44px;
      letter-spacing: -0.8px;
    }
  }
  @media screen and (max-width: 430px) {
    {{ section_identifier }} .sec_heading {
      font-size: 26px;
      line-height: 32px;  
      letter-spacing: -0.52px;
    }
  }
{%- endstyle -%}
<div class="position-relative container">
  <div class="content as-card-animation card-scale-init fw-bold bg-white overflow-hidden rounded-2">
    <div data-time="500" class="sec_heading wrap as-shuffle-text overflow-hidden letter-spacing-2">{{ section.settings.content }}</div>
  </div>
</div>

{% schema %}
  {
    "name": "Text", 
    "tag": "section", 
    "class":"as-brand-text-wrap brand-text-wrap",
    "settings": [
      {
        "type": "text",
        "id": "content",
        "label": "Content"
      }
    ]
  }
{% endschema %}